<!--
 * @Author: tansq
 * @Date: 2023-01-05 09:19:42
 * @LastEditTime: 2023-01-29 14:49:52
 * @LastEditors: tansq
 * @Description: 物料选择器
 * @FilePath: \hte-vue-dev\src\components\tools\MaraSelect.vue
 * 可以输入预定的版权声明、个性签名、空行等
-->
<template>
  <div class=''>

    <a-input @click="open" placeholder="请点击选择物料主数据" v-model="maktx" readOnly :disabled="disabled">
      <a-icon  class="anticon anticon-close-circle ant-input-clear-icon" v-if="clear && maktx" slot="suffix" type="close-circle" theme="filled" @click="handleEmpty" title="清空"/>
    </a-input>
    <table-select-modal   title="选择物料主数据" rowName="maktx" rowKey="matnr"  :listUrl="url.sapMaraList" :params="params"  :isAllSelect="isAllSelect" 
        :importColumns="maraSelectColums" ref="mara" @back="back" @ok="ok">
          
            <template v-slot:header="{ queryParam }">
              <slot name="header"   :queryParam="queryParam">
                <div style="margin-bottom: 20px;">
                <a-radio-group @change="maraChange" v-model="queryParam.maraLikeRight" >
                      <a-radio :value="'6'" :key="6">半成品</a-radio>
                      <a-radio :value="'7'" :key="7">成品</a-radio>
                      <a-radio :value="'8'" :key="8">产品</a-radio>
                </a-radio-group>
                </div>
              </slot>
            </template>
            
    </table-select-modal>
  </div>
</template>

<script>
export default {
  name: 'MaraSelect',
  mixins:[],
  components: {
    TableSelectModal: () => import('@/components/tools/TableSelectModal'),
  },
  props: {
    value:{
      type:String,
      require:false,
    },
    disabled:{
      type:Boolean,
      require:false,
      default:false,
    },
    clear:{
      type:Boolean,
      require:false,
      default:false,
    },
    isAllSelect:{
      type:Boolean,
      require:false,
      default:false,
    },
    maraCustomParam:{
      type:Object,
      require:false,
      default:()=>{
        return {status:0,maraLikeRightIn:'6,7,8',maraLikeRight:'6'}
      },
    },
    maraSelectColums: 
    {type:Array,
      require:false,
      default:()=>{
        return [
          {
            title:'物料编号',
            align:"center",
            dataIndex: 'matnr',
            width:100
          },
           {
            title:'物料名称',
            align:"center",
            dataIndex: 'maktx'
          }
        ]
      },
    }
  },
  data() {
    return {
      url:{sapMaraList:'/sapMara/list'},
      params:this.maraCustomParam,
      maktx:'',
      matnr:'',
      backInfo:['',''],
    };
  },
  model: {
      prop: 'value',
      event: 'change'
  },
  created(){
  },
  computed:{
  },
  mounted(){
    this.maktx = this.value
  },
  watch:{
    maraCustomParam:function(val){
      this.params =Object.assign(this.params,val)
    },
    value:function(val){
      this.maktx = val
    },
  },
  methods: {
    maraChange(e){
      this.params = JSON.parse(JSON.stringify(Object.assign(this.params,{maraLikeRight:e.target.value}) ) ) 
      this.$refs.mara.loadData()
    },
    back(info){
      
      this.backInfo=info;
    },
    ok(res){
      let backInfo = this.backInfo
      this.maktx=backInfo[1]||''
      this.matnr=backInfo[0]||''
      this.$emit("back", backInfo)
      this.$emit("change", this.maktx)
      this.$emit("ok", res)
     

    },
    handleEmpty(){
      this.back(['',''])
      this.$emit("change", '')
      this.$emit("clear") 
            
    },
    open(){
      if(!this.disabled){
      this.$refs.mara.open();
      }
    },
    close(){
      this.$refs.mara.close()
    },
  },
  filters: {
  },
 }
</script>

<style lang='scss' scoped>

</style>
